<!-- Study_CompetitiveProductsEditComment.html -->
<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0"/>
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<title>课程章节</title>
		<link rel="stylesheet" type="text/css" href="../../css/mui.min.css">
		<link rel="stylesheet" type="text/css" href="../../css/base.css"/>
		<link rel="stylesheet" href="../../css/CFNetPP_Base.css">
		<style type="text/css">
			html, body {
				margin: 0px;
				padding: 0px;
				height: 100%;
				/*background-color: white;*/
				/*font-family: "微软雅黑","宋体","Tahoma",Arial;*/
				/*color: #333333;*/
				background-color: rgba(0,0,0,0.2);
			}
			div, img, ul, li, ol, span, p, a, dl, dd, dt {
				margin: 0px;
				padding: 0px;
				border: 0px;
			}
			ul, li, ol, dl, dd, dt {
				list-style: none;
			}
			.overfl {
				overflow: hidden;
			}
			.fl {
				float: left;
			}
			.fr {
				float: right;
			}
			.hide {
				display: none;
			}
			textarea {
				border: none;
				padding: 0;
				outline: none;
				background: none;
				resize: none;
			}
			.outer {
				background-color: #fff;
				height: 100%;
				color: #787d82;
				overflow: hidden;
			}
			.mainTop {
				height: 35%;
				width: 100%;
				background: #14191e;
			}
			.mainBot {
				width: 100%;
				/*height: 65%;*/
				background: #fff;
				overflow: hidden;
				position: absolute;
				left: 0;
				bottom: 0;
			}
			.main_nav {
				width: 100%;
				overflow: hidden;
				line-height: 3.6 rem;
				font-size: 1.4 rem;
				border-bottom: 0.2 rem solid #e5e5e5;
			}
			.main_nav li {
				float: left;
				text-align: center;
				width: 25%;
			}
			.choiced {
				color: #0daff7;
				background: url(../img/blueLine.png) bottom center no-repeat;
				background-size: 2.5em;
			}
			.mainDiv {
				overflow: hidden;
				overflow-y: scroll;
				width: 100%;
				/*height: 88%;*/
			}
			.mainDiv .zhangjie {
				width: 90%;
				display: block;
				margin: 0px 5%;
			}
			.mainDiv .wenda, .mainDiv .biji, .mainDiv .ziliao {
				/*width: 90%;
				 margin: 0px 5%;*/
				/*display: none;*/
				padding: 10px;
			}
			.ListParent li {
				cursor: pointer;
				overflow: hidden;
				position: relative;
				clear: left;
			}
			.ListParent .ListA {
				font-size: 1.2 rem;
				padding: 1.0 rem 0px 0.8 rem;
				text-align: justify;
			}
			.ListParent .ListB, .ListParent .ListC {
				font-size: 1.2 rem;
				/*	line-height: 3.6rem;*/
				/*line-height: 100%;*/
				padding-top: 0.8 rem;
				padding-bottom: 0.8 rem;
			}
			.ListParent .ListB, .ListParent .ListC {
				padding-left: 1.4 rem;
			}
			/*.ListParent .ListC{padding-left: 2.8rem;}*/
			.ListParent .ListB a {
				width: 70%;
			}
			.ListParent .ListC a {
				width: 68.4%;
			}
			.ListB .iconSJ, .ListC .iconSJ {
				float: left;
				vertical-align: middle;
				margin-right: 0.5 rem;
				display: block;
				width: 1.0 rem;
				height: 100%;
			}
			.ListB .iconSJ img, .ListC .iconSJ img {
				width: 1.0 rem;
				height: 0.8 rem;
			}
			.ListParent .ListB span, .ListParent .ListC span {
				float: right;
				/*line-height: 3.6rem;*/
				/*line-height: 100%;*/
				height: 100%;
			}
			.ListParent li a {
				/*overflow: hidden;
				 text-overflow: ellipsis;
				 white-space: nowrap;*/
				float: left;
				display: block;
				/*line-height: 3.6rem;*/
				color: #787d82;
				text-decoration: none;
			}
			.ListParent .ListA span:nth-child(1) {
				/*width: 80%;*/
				width: 100%;
				/*overflow: hidden;
				 text-overflow: ellipsis;
				 white-space: nowrap;*/
				float: left;
				display: block;
				/*line-height: 100%;*/
				color: #787d82;
				text-decoration: none;
			}
			.ListParent li span:nth-child(2) {
				float: left;
			}
			.topHeight {
				width: 100%;
			}
			.Divtit {
				font-size: 1rem;
				padding-top: 3%;
			}
			.wendaArea {
				width: 100%;
				height: 100px;
				margin: 0 0 4px 0;
				border: 1px solid #d6d6d6;
				/*display: block;*/
				/*#0cb0f6*/
				padding: 2%;
				font-size: 14px;
				/*line-height: 2.6rem;*/
				color: #787d82;
			}
			.submit {
				width: 60px;
				height: 24px;
				line-height: .8rem;
				background-color: #0cb0f6;
				color: #fff;
				border: 0px;
				font-size: 12px;
				float: right;
				border-radius: .2rem;
				outline: none;
			}
			.wendaTop {
				height: 33%;
			}
			.wendaBot {
				/*height: 66%;*/
				overflow: hidden;
				/*overflow-y: scroll;*/
				margin: 0px auto;
			}
			.wenda_List {
				border-bottom: 1px dotted #0cb0f6;
				margin-bottom: 1.0 rem;
			}
			.wenda_List li {
				line-height: 24px;
				font-size: 14px;
			}
			.wendaAutor {
				padding: 0px 1.0 rem 0px 0px;
			}
			.ziliaoBot {
				height: 100%;
				padding: 1.0 rem 5%;
			}
			.ziliaoBot a {
				color: #787d82;
				text-decoration: none;
			}
			.ziliaoBot a:hover {
				text-decoration: underline;
			}
			.btnMore {
				line-height: 3.6 rem;
				font-size: 1.2 rem;
				text-align: center;
				display: block;
				color: #787d82;
				text-decoration: none;
			}
			.learnStatus {
				height: 100%;
				width: 1.4 rem;
				vertical-align: middle;
				float: left;
			}
			.nameLabel {
				margin-top: 10px;
				margin-left: 8px;
				position: absolute;
				font-size: 14px;
				color: #222;
			}
			.contentDiv {
				/*margin-left: 15px;*/
				font-size: 14px;
				text-overflow: -o-ellipsis-lastline;
				overflow: hidden;
				text-overflow: ellipsis;
				display: -webkit-box;
				/*-webkit-line-clamp: 3;*/
				-webkit-box-orient: vertical;
				color: #222;
			}
			.timeSpan {
				/*display: block;*/
				margin-top: 5px;
				/*margin-left: 15px;*/
				color: #666;
				font-size: 12px;
			}
			.question_detail {
				background-color: white;
				padding: 10px;
				/*border-bottom: 1px solid #ddd;*/
			}
			.right-span {
				margin-left: 60px;
			}
			/*.answer-div{
			 background-color: white;
			 }*/
			.starDiv {
				margin-bottom: 10px
			}
			.starXingDiv {
				margin-left: 5px;
				margin-top: 2px;
			}
			.bg-div{
				width: 100%;
				height: 100%;
				background-color: rgba(0,0,0,0.2);
			}
		</style>
	</head>
	<body>
		<div class="bg-div"></div>
		<div class="mainBot" onclick="bottomDivClick()">
			<div class="mainDiv">
				<div class="mainList biji">
					<div class="wendaTop">
						<div class="myScore-starscore clearfix starDiv">
							<!--<p class="title bottom_5" >
							评分
							</p>-->
							<div class="star left starXingDiv" id="taiduNum">
								<img src="../../image/icon_xingxing01.png" style="height: 18px">
								<img src="../../image/icon_xingxing01.png"style="height: 18px;">
								<img src="../../image/icon_xingxing01.png"style="height: 18px">
								<img src="../../image/icon_xingxing01.png"style="height: 18px">
								<img src="../../image/icon_xingxing01.png"style="height: 18px">
								<img src="../../image/icon_xingxing01.png" hidden="hidden">
							</div>
						</div>
						<div class="overfl topHeight">
							<textarea id="user_note" class="wendaArea" placeholder="请输入评论,最多可输入300字" maxlength="300"></textarea>
							<button class="submit" onclick="AddCommment()">
								提交
							</button>
						</div>
					</div>
				</div>
			</div>
		</div>
	</body>
	<script type="text/javascript" src="../../script/jquery.min.js"></script>
	<script type="text/javascript" src="../../script/api.js"></script>
	<script type="text/javascript" src="../../script/MD5.js"></script>
	<script src="../../script/common.js"></script>
	<script type="text/javascript" src="../../script/requestTool.js"></script>
	<script type="text/javascript" src="../../script/timeStampTool.js"></script>
	<script type="text/javascript">
		var sxtdScore = 0;
		var pid = "";
		// 计划id
		var cid = "";
		//课程id
		var title = "";
		apiready = function() {
			var pageParam = api.pageParam;
			pid = pageParam.pid;
			cid = pageParam.cid;
			title = pageParam.title;
			$("#taiduNum img").eq(0).prevAll().attr("src", "../../image/icon_xingxing01.png")
			$('#user_note').val('');
			setupStarClick();
			//安卓手机系统返回键事件
			keyback();
			setupBgClick();
		}
		//安卓手机系统返回键事件
		function keyback() {
			api.addEventListener({
				name : 'keyback'
			}, function(ret, err) {
				closeFrame();
			});
		}

		function bottomDivClick() {
			event.stopPropagation();	
		}
		//提交新的课程评论
		function AddCommment() {
			var reg = /\s/;
			var newcontent = $('#user_note').val().trim();
			var param = {
				uid : $api.getStorage('cfnetppuid'),
				jid : $api.getStorage('cfnetppjxid'),
				cid : cid,
				score : sxtdScore,
				comment : newcontent
			};
			//			alert(JSON.stringify(param))
			if (sxtdScore == 0) {
				ShowToast("请你打分");
			} else if (newcontent == null || newcontent == "" || isOnlySpaceOrEnter(newcontent)) {
				ShowToast("输入不能为空");
			} else if (newcontent.length > 300) {
				ShowToast("字数不能超过300字");
			} else {
				showProgress();
				cfnetppPOST(url_PublicAddComment, param, false, function(data, status) {
					hideProgress();
					if (status == 'success') {
						if (data.code == 200) {
							ShowToast('提交评论成功');
							$("#taiduNum img").eq(5).prevAll().attr("src", "../../image/icon_xingxing01.png")
							$('#user_note').val('');
							sxtdScore = 0;
							sendNotifi();
							closeFrame();
						} else {
							api.toast({
								msg : '提交评论失败',
								duration : 2000,
								location : 'bottom'
							});
						}
					} else {
						api.toast({
							msg : '网络异常',
							duration : 2000,
							location : 'bottom'
						});
					}
				});
			}
		}

		function setupStarClick() {
			$('.star img').each(function(i) {
				$(this).click(function() {
					$(this).attr('src', '../../image/icon_xingxing.png');
					$(this).prevAll().attr('src', '../../image/icon_xingxing.png');
					$(this).nextAll().attr('src', '../../image/icon_xingxing01.png');
					var score = ($(this).prevAll().length + 1);
					if ($(this).parent().attr('id') == 'taiduNum') {//实习态度
						sxtdScore = score;
					}
				})
			});
		}

		function deleteSpaceEnter(str) {
			str = str.replace(/\s+/g, "");
			str = str.replace(/[\r\n]/g, "");
			return str;
		}
		function setupBgClick(){
			$(".bg-div").on("click",function(){
				closeFrame();
			});
		}
		function closeFrame() {
			api.setFrameAttr({
				name : 'Study_CompetitiveProductsEditComment',
				hidden : true
			});
		}

		function sendNotifi() {
			api.sendEvent({
				name : 'refreshCPCommentListNotifi'
			});
		}
	</script>
</html>